<template>
  <a-modal
    title="签约信息"
    width="50%"
    :visible="visible"
    :confirmLoading="confirmLoading"
    cancelText="关闭"
    @ok="handleSubmit"
    @cancel="handleCancel"
    destroyOnClose
  >
    <a-row>
      <a-col
        :offset="6"
        :xs="18"
        :sm="24"
      >
        <detail-list
          title=""
          :col="1"
        >
          <detail-list-item term="签约方式">{{ displaySignType(signInfo.signType) }}</detail-list-item>
          <detail-list-item term="身份证照片">
            <a-avatar
              shape="square"
              :size="84"
              v-for="(item,index) in signInfo.idImage"
              :key= index
              :src="isHttpString(item)?item:idcardImageUrlPrefix + item"
              style="margin-right:8px"
            />
            <!-- <a-avatar
              shape="square"
              :size="84"
              :src="idcardImageUrlPrefix + signInfo.idcardImageFace"
            />
            <a-avatar
              :style="{marginLeft: '8px'}"
              shape="square"
              :size="84"
              :src="idcardImageUrlPrefix + signInfo.idcardImageBack"
            /> -->
          </detail-list-item>
          <detail-list-item term="签约照片">
            <img
              class="qyimg"
              :src="isHttpString(signInfo.signImage)?signInfo.signImage:imageUrlPrefix + signInfo.signImage"
            />
          </detail-list-item>
          <detail-list-item term="签约合同">
            <a
              v-if="signInfo.contractUrl"
              :href="isHttpString(signInfo.contractUrl)?signInfo.contractUrl : imageUrlPrefix + signInfo.contractUrl"
              type="primary"
              target="_blank"
            >合同链接，点击打开</a>
            <a
              v-else
              type="primary"
              target="_blank"
            >暂无合同</a>
          </detail-list-item>
        </detail-list>
      </a-col>
    </a-row>
  </a-modal>
</template>

<script>
import DetailList from '@/components/tools/DetailList'
import { getSignInfoByUserId, updateSignStatusByUserId } from '@/api/manage'
import config from '@/config/defaultSettings'

const DetailListItem = DetailList.Item

export default {
  name: 'OrderDetailModal',
  components: {
    DetailList,
    DetailListItem
  },
  data() {
    return {
      imageUrlPrefix: config.uploadedUrlPrefix,
      idcardImageUrlPrefix: config.idcardImageUrlPrefix,
      visible: false,
      confirmLoading: false,
      individualUserId: null,
      signInfo: {
        contractUrl: '',
        idcardIcon: '',
        signIcon: '',
        signType: ''
      }
    }
  },
  methods: {
    show(individualUserId) {
      
      this.individualUserId = individualUserId
      getSignInfoByUserId(individualUserId)
        .then(res => {
          this.visible = true
          if (res.resData) this.signInfo = res.resData
          console.log(this.signInfo)
          this.signInfo.idImage = this.signInfo.idcardImage.split(',')
        })
    },
    handleCancel() {
      this.visible = false
    },
    handleSubmit() {
      // this.confirmLoading = true
      // updateSignStatusByUserId(this.individualUserId)
      //   .then(res => {
      this.handleCancel()
      this.$emit('onSuccess')
      //   })
      //   .finally(() => {
      this.confirmLoading = false
      //   })
    },

    displaySignType(signType) {
      switch (signType) {
        case 1:
          return '小程序签约'
         case 2:
          return '短信签约'
         case 3:
          return 'API接口签约'
         case 4:
          return '线下批量签约'
        default:
          return '小程序签约'
      }
    }
  }
}
</script>
<style>
  .qyimg{
    max-width: 84px;
  }
</style>